<template>
  <input :type="type" ref="target" @input="input" :modelValue="modelValue" :value="modelValue" />
  <!-- <input type="text" /> -->
</template>

<script>
import { ref } from 'vue'
export default {
  name: 'HInput',
  props: {
    // 默认输入框类型
    type: {
      type: String,
      default: 'text'
    },
    modelValue: {
      type: String,
      default: ''
    }
  },
  setup(props, { emit }) {
    const target = ref(null)
    // emit('update:modelValue',)
    // 监听输入框中的内容是否有改变
    const input = res => {
      console.log(res)
      // console.log(res.data)
      emit('update:modelValue', res.data)
      console.log(target)
    }

    return { target, input }
  }
}
</script>

<style></style>
